/**
 * <pre>
 * Listens to HELP_COMMAND and displays notifications.
 * Provides interactive tutorial for first time users.
 * </pre>
 * 
 * @constructor
 * @param {mindmaps.EventBus} eventBus
 * @param {mindmaps.commandRegistry} commandRegistry
 */
mindmaps.HelpController = function(eventBus, commandRegistry) {

	/**
	 * Prepare tutorial guiders.
	 */
	function setupInteractiveMode() {
		if (isTutorialDone()) {
			console.debug("skipping tutorial");
			return;
		}

		var notifications = [];
		var interactiveMode = true;

		// start tutorial after a short delay
		eventBus.once(mindmaps.Event.DOCUMENT_OPENED, function() {
			setTimeout(start, 1000);
		});

		function closeAllNotifications() {
			notifications.forEach(function(n) {
				n.close();
			});
		}

		var helpMain, helpRoot;
		function start() {
			helpMain = new mindmaps.Notification(
					"#topbar",
					{
						position : "bottomMiddle",
						maxWidth : 400,
						title : "Crea un hipermedio",
						content : "<p>¡Aprende a usar nidea en unos simples pasos!</p> \n\
                                                                <div id='tutorial'><a class='do-tutorial link'>Empezar<br/><a/></div> \n\
                                                                <div id='saltar'><a class='skip-tutorial link'>Saltar tutorial<a/></div>"
					});
			notifications.push(helpMain);
			helpMain.$().find("a.skip-tutorial").click(function() {
				interactiveMode = false;
				closeAllNotifications();
				tutorialDone();
			});
                        helpMain.$().find("a.do-tutorial").click(function() {
                                closeAllNotifications();
				theRoot();
			});
		}

		function theRoot() {
			if (isTutorialDone())
				return;

			helpRoot = new mindmaps.Notification(
					".node-caption.root",
					{
						position : "topMiddle",
						closeButton : true,
						maxWidth : 350,
						title : "Esta es la idea central del proyecto",
						content : "Haz doble click en el nodo para asociar un concepto."
					});
			notifications.push(helpRoot);

			eventBus.once(mindmaps.Event.NODE_WINDOW_CLOSED, function() {
				helpRoot.close();
				setTimeout(crearMedio, 900);
			});
		}
                
                function crearMedio() {
			if (isTutorialDone())
				return;

			var helpNewMedio = new mindmaps.Notification(
					".node-container.root",
					{
						position : "topMiddle",
						closeButton : true,
						maxWidth : 350,
						title : "Creando un medio",
						content : "Cada concepto del proyecto puedes relacionarlo con una imagen, sonido, texto, video o una dirección web. Haz click sobre el nodo para generar un medio"
					});
			notifications.push(helpNewMedio);
//			setTimeout(inspector, 2000);

			eventBus.once(mindmaps.Event.NODE_WINDOW_CLOSED, function() {
				helpNewMedio.close();
				setTimeout(theNub, 900);
			});
		}

		function theNub() {
			if (isTutorialDone())
				return;

			var helpNub = new mindmaps.Notification(
					".node-caption.root",
					{
						position : "topMiddle",
						closeButton : true,
						maxWidth : 350,
						padding : 20,
						title : "Creando nuevos conceptos",
						content : "Construye un nuevo concepto arrastrando el círculo rojo que aparece sobre la idea central."
					});
			notifications.push(helpNub);
			eventBus.once(mindmaps.Event.NODE_CREATED, function() {
				helpMain.close();
				helpNub.close();
				setTimeout(newNode, 900);
			});
		}

		function newNode() {
			if (isTutorialDone())
				return;

			var helpNewNode = new mindmaps.Notification(
					".node-container.root > .node-container:first",
					{
						position : "topMiddle",
						closeButton : true,
						maxWidth : 350,
						title : "Este es el segundo nodo",
						content : "Haz doble click sobre el nodo para asociarlo a un nuevo concepto. De esta manera, podrás continuar creando conceptos en el mapa."
					});
			notifications.push(helpNewNode);
//			setTimeout(inspector, 2000);

			eventBus.once(mindmaps.Event.NODE_WINDOW_CLOSED, function() {
				helpNewNode.close();
				setTimeout(navigate, 0);
//				setTimeout(toolbar, 15000);
				setTimeout(menu, 10000);
				setTimeout(tutorialDone, 20000);
			});
		}
                
		function navigate() {
			if (isTutorialDone())
				return;

			var helpNavigate = new mindmaps.Notification(
					"#statusbar",
					{
						position : "topRight",
						closeButton : true,
						maxWidth : 350,
						expires : 10000,
						title : "Navega por el mapa",
						content : "Puedes utilizar el panel de navegación para visualizar el mapa con mayores detalles. También puedes arrastrar el fondo para mover el mapa para desplazarte."
					});
			notifications.push(helpNavigate);
		}

		function inspector() {
			if (isTutorialDone())
				return;

			var helpInspector = new mindmaps.Notification(
					"#inspector",
					{
						position : "leftBottom",
						closeButton : true,
						maxWidth : 350,
						padding : 20,
						title : "Don't like the colors?",
						content : "Use these controls to change the appearance of your ideas. "
								+ "Try clicking the icon in the upper right corner to minimize this panel."
					});
			notifications.push(helpInspector);
		}

		function toolbar() {
			if (isTutorialDone())
				return;

			var helpToolbar = new mindmaps.Notification(
					"#toolbar .buttons-left",
					{
						position : "bottomLeft",
						closeButton : true,
						maxWidth : 350,
						padding : 20,
						title : "The tool bar",
						content : "Those buttons do what they say. You can use them or work with keyboard shortcuts. "
								+ "Hover over the buttons for the key combinations."
					});
			notifications.push(helpToolbar);
		}

		function menu() {
			if (isTutorialDone())
				return;

			var helpMenu = new mindmaps.Notification(
					"#statusbar",
					{
						position : "topRight",
						closeButton : true,
						maxWidth : 350,
                                                expires : 10000,
						title : "Guarda el proyecto cuando termines tu trabajo",
						content : "Con este botón podrás guardar los avances que has realizado."
					});
			notifications.push(helpMenu);
		}

		function isTutorialDone() {
			return mindmaps.tutorial;
		}

		function tutorialDone() {
			mindmaps.tutorial = true;
                        $.ajax({
                            type: 'POST',
                            url: $('#form_tutorial').attr('action'),
                            data: {id : hipermedio_id},
                            // Mostramos un mensaje con la respuesta de PHP
                            success: function(data) {
                                
                            }  
                        })
		}

	}

	/**
	 * Prepares notfications to show for help command.
	 */
	function setupHelpButton() {
		var command = commandRegistry.get(mindmaps.HelpCommand);
		command.setHandler(showHelp);

		var notifications = [];
		function showHelp() {
			// true if atleast one notifications is still on screen
			var displaying = notifications.some(function(noti) {
				return noti.isVisible();
			});

			// hide notifications if visible
			if (displaying) {
				notifications.forEach(function(noti) {
					noti.close();
				});
				notifications.length = 0;
				return;
			}

			// show notifications
			var helpRoot = new mindmaps.Notification(
					".node-caption.root",
					{
						position : "bottomLeft",
						closeButton : true,
						maxWidth : 350,
						title : "This is your main idea",
						content : "Double click an idea to edit its text. Move the mouse over "
								+ "an idea and drag the red circle to create a new idea."
					});

			var helpNavigator = new mindmaps.Notification(
					"#navigator",
					{
						position : "leftTop",
						closeButton : true,
						maxWidth : 350,
						padding : 20,
						title : "This is the navigator",
						content : "Use this panel to get an overview of your map. "
								+ "You can navigate around by dragging the red rectangle or change the zoom by clicking on the magnifier buttons."
					});

			var helpInspector = new mindmaps.Notification(
					"#inspector",
					{
						position : "leftTop",
						closeButton : true,
						maxWidth : 350,
						padding : 20,
						title : "This is the inspector",
						content : "Use these controls to change the appearance of your ideas. "
								+ "Try clicking the icon in the upper right corner to minimize this panel."
					});

			var helpToolbar = new mindmaps.Notification(
					"#toolbar .buttons-left",
					{
						position : "bottomLeft",
						closeButton : true,
						maxWidth : 350,
						title : "This is your toolbar",
						content : "Those buttons do what they say. You can use them or work with keyboard shortcuts. "
								+ "Hover over the buttons for the key combinations."
					});

			notifications.push(helpRoot, helpNavigator, helpInspector,
					helpToolbar);
		}
	}

	setupInteractiveMode();
	setupHelpButton();
};
